import { Suspense, useEffect } from 'react'
import {
  Routes,
  Route
} from "react-router-dom"
import { PageObserver } from './utils/pageObserver' 
import routes from './router'

declare global {
  interface Window {
    pageObserver: PageObserver;
  }
}
function App() {
  useEffect(() => {
    window.pageObserver = PageObserver.getInstance();
    window.pageObserver.addObserver('fcp');
    return () => {}
  }, [])
  return <Suspense fallback={<span>loading</span>}>
    <Routes>
      {routes.map((route) => (
        <Route
          key={route.path}
          path={route.path}
          element={route.element}
        />
      ))}
    </Routes>
  </Suspense>
}

export default App